<script setup>
import {router} from "../../../router"
const returnBtn = () => {
    router.replace('/learn/isMy/init')
}
</script>

<template>
    <div class="returnBtnBox">
        <span @click="returnBtn()">返回首页</span>
    </div>
    <div class="MasterBox">
        <div class="masterBox"></div>
        <div class="bottomBox">
            <div class="returnBtn">上一页</div>
            <div class="nextBtn">下一页</div>
        </div>
    </div>
</template>

<style scoped>
.returnBtnBox{
    position: absolute;
    left: 2%;
    top: 2%;
    width: 100px;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
}
.returnBtnBox span:hover{
    cursor:pointer;
    color: red;
}
.MasterBox{
    position: absolute;
    left: 2.5%;
    top: 10%;
    width: 95%;
    height: 90%;
}
.masterBox{
    width: 100%;
    height: 93%;
    overflow-y: auto;
}
.bottomBox{
    width: 100%;
    height: 7%;
    background: rgba(200, 200, 200, 0.4);
    display: flex;
    align-items: center;
}
.returnBtn{
    position: absolute;
    left: 3%;
    bottom: 0;
    width: 5%;
    height: 7%;
    display: flex;
    align-items: center;
    cursor: pointer;
}
.nextBtn{
    position: absolute;
    right: 3%;
    bottom: 0;
    width: 5%;
    height: 7%;
    display: flex;
    align-items: center;
    cursor: pointer;
}
</style>